<template>
  <view class="container">
    <!-- 学生信息卡片 -->
    <view class="student-card">
      <view class="student-avator">
        <image :src="imgPath" @click="chooseImage()" class="avatar-img"></image>
      </view>
      <view class="student-info">
        <text class="name">{{ studentInfo.name || '未获取姓名' }}</text>
        <text class="major">{{ studentInfo.major || '未获取专业' }}</text>
        <text class="studentNo">{{ studentInfo.studentNumber || '未获取学号' }}</text>
      </view>
      <view class="status-badge" :class="{'completed': studentInfo.status === '已报到'}">
        {{ studentInfo.status || '未报到' }}
      </view>
    </view>

    <!-- 菜单模块 -->
    <view class="menu-grid">
      <u-grid :border="true" gutter="20" col="3">
        <u-grid-item v-for="(menuItem, index) in menuList" :key="index" bgColor="#fff">
          <view class="icon-item" :style="{backgroundColor: menuItem.color}">
            <u-icon :name="menuItem.name" :size="30" color="#fff"></u-icon>
          </view>
          <text class="grid-text">{{ menuItem.title }}</text>
        </u-grid-item>
      </u-grid>
    </view>

    <!-- 通知公告 -->
    <view class="notic-section">
      <view class="section-header">
        <text class="title">最新通知</text>
        <text class="more">更多</text>
      </view>
      <view class="notice-list">
        <view class="notice-item" v-for="(notice, index) in notices" :key="notice.id">
          <view class="badge" v-if="notice.isNew">新</view>
          <view class="content">
            <text class="notice-title">{{ notice.title }}</text>
            <view class="notice-desc" v-html="processContent(notice.content)"></view>
            <text class="notice-time">{{ notice.createTime }}</text>
          </view>
        </view>
        <view v-if="notices.length === 0" class="no-notice">暂无通知</view>
      </view>
    </view>
	<!-- ★ 固定右下 AI 入口 -->
	    <view class="ai-entry" @click="goAI">
	      <u-icon name="AI" color="#fff" size="28"></u-icon>
	    </view>
	  
  </view>
  
</template>

<script>
export default {
  data() {
    return {
      imgPath: '/static/image/image/avatar.png',
      studentInfo: {},
      menuList: [
        { name: 'man-add', title: '信息提交', color: '#4CAF50' },
        { name: 'rmb-circle', title: '在线缴费', color: '#FF9800'},
        { name: 'search', title: '信息查询', color: '#2196F3' },
        { name: 'calendar', title: '日常安排', color: '#9C27B0' },
        { name: 'map', title: '校园地图', color: '#607D8B' },
        { name: 'phone', title: '联系我们', color: '#E91E63' }
      ],
      notices: []
    };
  },
  onLoad() {
    this.loadStudentInfoFromCache();
    this.loadNotices();
  },
  methods: {
    // 仅从缓存加载学生信息（不再请求接口）
    loadStudentInfoFromCache() {
      const cached = uni.getStorageSync('studentInfo');
      if (cached && cached.studentNumber) {
        this.studentInfo = cached;
        if (cached.photo && cached.photo.startsWith('http')) {
          this.imgPath = cached.photo;
        }
      } else {
        uni.navigateTo({ url: '/pages/login/index' });
        uni.showToast({ icon: 'none', title: '请先登录' });
      }
    },
	goAI() {
	      this.isJump = true;
	      setTimeout(() => {
	        this.isJump = false;
	        uni.navigateTo({ url: '/pages/ai/chat' });
	      }, 300);    // 动画 300 ms 后跳转
	    },
    chooseImage() {
      const sn = this.studentInfo.studentNumber;
      if (!sn) {
        uni.showToast({ icon: 'none', title: '未获取到学号' });
        return;
      }
      uni.chooseImage({
        count: 1,
        sizeType: ['original', 'compressed'],
        sourceType: ['album', 'camera'],
        success: (res) => {
          uni.showLoading({ title: '上传中' });
          uni.uploadFile({
            url: 'http://192.168.12.236:8080/api/student/upload',
            filePath: res.tempFilePaths[0],
            name: 'photo',
            formData: { studentNo: sn },
            success: (upRes) => {
              uni.hideLoading();
              const result = JSON.parse(upRes.data);
              if (result.code === 200 && result.data) {
                this.imgPath = result.data;
                const info = uni.getStorageSync('studentInfo');
                info.photo = result.data;
                uni.setStorageSync('studentInfo', info);
                uni.showToast({ title: '头像已更新', icon: 'success' });
              } else {
                uni.showToast({ icon: 'none', title: result.message || '上传失败' });
              }
            },
            fail: () => {
              uni.hideLoading();
              uni.showToast({ icon: 'none', title: '网络错误' });
            }
          });
        }
      });
    },

    loadNotices() {
      uni.showLoading({ title: '加载通知中' });
      uni.request({
        url: 'http://192.168.12.236:8080/api/notice',
        method: 'GET',
        data: { currentPage: 1, pageSize: 5 },
        success: (res) => {
          uni.hideLoading();
          if (res.data && res.data.code === 200) {
            const list = res.data.data.records || [];
            this.notices = list.map(n => {
              const days = (Date.now() - new Date(n.createTime)) / (1000 * 60 * 60 * 24);
              return { ...n, isNew: days <= 7 };
            });
          } else {
            uni.showToast({ icon: 'none', title: '获取通知失败' });
          }
        },
        fail: () => {
          uni.hideLoading();
          uni.showToast({ icon: 'none', title: '网络请求失败' });
        }
      });
    },

    processContent(content) {
      if (!content) return '';
      return content
        .replace(/<(?!img)[^>]*>/g, '')
        .replace(/<img([^>]*)>/g, (_, attr) => {
          const src = (attr.match(/src="([^"]*)"/) || [])[1] || '';
          const alt = (attr.match(/alt="([^"]*)"/) || [])[1] || '图片';
          return `<img src="${src}" alt="${alt}" style="max-width:100%;height:auto;margin:10rpx 0;" />`;
        });
    }
  }
};
</script>
<style>
.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  background-color: #f5f7fa;
  min-height: 100vh;
  padding-top: 20rpx;
}
.student-card {
  width: 95%;
  background: linear-gradient(135deg, #1e88e5, #0d47a1);
  margin: 20rpx;
  border-radius: 25rpx;
  display: flex;
  align-items: center;
  color: #fff;
  box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.1);
}
.student-avator {
  margin: 30rpx;
}
.avatar-img {
  width: 150rpx;
  height: 150rpx;
  border-radius: 50%;
  border: 4rpx solid rgba(255, 255, 255, 0.5);
  cursor: pointer;
}
.student-info {
  flex: 1;
}
.student-info text {
  display: block;
}
.name {
  font-size: 36rpx;
  font-weight: bold;
  margin-bottom: 8rpx;
}
.major, .studentNo {
  font-size: 28rpx;
  opacity: 0.8;
  margin-bottom: 4rpx;
}
.status-badge {
  background: #ff5722;
  color: #fff;
  border-radius: 20rpx;
  font-size: 24rpx;
  padding: 8rpx 16rpx;
  margin-right: 30rpx;
}
.status-badge.completed {
  background-color: rgba(76, 175, 80, 0.6);
}
.menu-grid {
  width: 95%;
  margin-top: 20rpx;
}
.icon-item {
  width: 80rpx;
  height: 80rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin-top: 20rpx;
  margin-left: auto;
  margin-right: auto;
}
.grid-text {
  color: #909399;
  padding: 10rpx 0 20rpx 0;
  text-align: center;
  box-sizing: border-box;
}
.notic-section {
  background: #fff;
  border-radius: 16rpx;
  width: 95%;
  margin-top: 30rpx;
  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05);
}
.section-header {
  width: 90%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20rpx;
  padding: 30rpx;
}
.title {
  font-size: 32rpx;
  font-weight: bold;
}
.more {
  font-size: 26rpx;
  color: #1e88e5;
}
.notice-list {
  margin-top: 20rpx;
  padding: 0 30rpx 30rpx;
}
.notice-item {
  display: flex;
  padding: 20rpx 0;
  border-bottom: 1rpx solid #eee;
}
.notice-item:last-child {
  border-bottom: none;
}
.badge {
  width: 40rpx;
  height: 40rpx;
  background-color: #FF5722;
  color: #fff;
  border-radius: 8rpx;
  font-size: 20rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 20rpx;
  flex-shrink: 0;
}
.content {
  flex: 1;
}
.notice-title {
  font-size: 28rpx;
  font-weight: bold;
  margin-bottom: 8rpx;
  display: block;
}
.notice-desc {
  font-size: 24rpx;
  color: #666;
  margin-bottom: 8rpx;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.notice-time {
  font-size: 22rpx;
  color: #999;
  display: block;
}
.notice-desc {
  font-size: 24rpx;
  color: #666;
  margin-bottom: 8rpx;
  line-height: 1.6;
}
.no-notice {
  text-align: center;
  padding: 30rpx 0;
  color: #999;
  font-size: 28rpx;
}
.ai-entry.jump {
  animation: jump 300ms ease;
}
@keyframes jump {
  0%   { transform: scale(1); }
  50%  { transform: scale(1.2) translateY(-10rpx); }
  100% { transform: scale(1); }
}
/* ===== 原有样式全部不动，只追加下面 ===== */
.ai-entry {
  position: fixed;
  right: 40rpx;
  bottom: 750rpx;
  width: 100rpx;
  height: 100rpx;
  border-radius: 50%;
  background: #1e88e5;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999;
}
</style>
